<style>

.main-header-toggle,.main-header-search,.main-header-left{
    display: inline-block;
    margin: 6px;
}
.main-header-left li,.main-header-bread li{
  display: inline-block;
}
.main-header-usergroup{
    position: absolute;
    right: 40px;
    top: 0px;
    line-height: 60px;

}
.header-group-user{
  display: inline-block;
}
.header-group-user ul{
  margin-bottom: 0px;
}
.header-group-user img{
    border-radius: 100%;
    width: 40px;
    height: 40px;
}
.header-group-operate li{
    display: inline-flex;
    margin: 0px;
}
.header-group-operate{
  margin-right: 30px;
}
.header-group-operate li{
  padding: 0px 10px;
}
.main-user-name{
  font-size: 16px;
}
.header-group-operate a,.main-user-name,.main-header-left a{
  color:#36404a;
}
.main-header-left ul,.main-header-bread ul{
  margin: 0px;
}
.main-header-left li a{
  padding-left: 10px;
  padding-right: 10px;
}
</style>
<template>
<div>
  <div class="main-header-toggle"><a class="ivu-btn ivu-btn-text" style="transform: rotateZ(0deg);"><span><i class="ivu-icon ivu-icon-navicon" style="font-size: 32px;"></i></span></a></div>
  <div class="main-header-left">
    <ul>
      <li><a><Icon type="happy-outline" style="font-size:20px;"></Icon></a></li>
      <li><a><Icon type="tshirt-outline" style="font-size:20px;"></Icon></a></li>
    </ul>
  </div>
  <div class="main-header-usergroup">
      <div class="header-group-user">
          <div style="display:inline-block" >
            <ul class="header-group-operate">
                <li><Badge dot><a><Icon type="locked" size="22"></Icon></a></Badge></li>
                <li><a><Icon type="checkmark-circled" size="22"></Icon></a></Badge></li>
                <li><Badge count="100"><a><i class="ivu-icon ivu-icon-paintbucket" style="font-size: 22px;"></i></a></Badge></li>
            </ul>
          </div>
          <div style="display:inline-block" class="header-user-imag">
            <img src="http://api.randomuser.me/portraits/thumb/men/28.jpg">
            <a href=""><span class="main-user-name"> &nbsp;Hello,Dave</span></a>
          </div>
      </div>
  </div>
</div>
</template>
<script>
    export default {
    	data:function(){
    		return {

    		}
    	},
      computed: {

      },
      watch: {

      },
      created:function(){

      },
			methods: {

			}
    };
</script>
